<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/style.css">
    <script type="text/javascript" charset="utf-8">
      	mui.init();
      
      	// 初始化页面中的MUI控件 mui.init({ /*设置各种手势操作的开关*/ gestureConfig:{ tap: true, //默认为true doubletap: true, //默认为false longtap: true, //默认为false swipe: true, //默认为true drag: true, //默认为true hold:false,//默认为false，不监听 release:false//默认为false，不监听 } });
    </script>
</head>
<body>
	<!-- 缩放式侧滑（类手机QQ） -->
	<!-- 侧滑导航根容器 -->
	<div class="mui-off-canvas-wrap mui-draggable mui-scalable">
	  <!-- 菜单容器 -->
	  <aside class="mui-off-canvas-left mui-transitioning" id="offCanvasSide">
	    <div class="mui-scroll-wrapper">
	      <div class="mui-scroll">
	        <!-- 菜单具体展示内容 -->
	        
	      </div>
	    </div>
	  </aside>
	  <!-- 主页面容器 -->
	  <div class="mui-inner-wrap mui-transitioning">
	    <!-- 主页面标题 -->
	    <header class="mui-bar mui-bar-nav">
	      
	      <h1 class="mui-title">易捷智能计算器</h1>
	    </header>
	    <!--<nav class="mui-bar mui-bar-tab">
		    <a class="mui-tab-item mui-active">
		        <span class="mui-icon mui-icon-home"></span>
		        <span class="mui-tab-label">首页</span>
		    </a>
		    <a class="mui-tab-item">
		        <span class="mui-icon mui-icon-phone"></span>
		        <span class="mui-tab-label">电话</span>
		    </a>
		    <a class="mui-tab-item">
		        <span class="mui-icon mui-icon-email"></span>
		        <span class="mui-tab-label">邮件</span>
		    </a>
		    <a class="mui-tab-item">
		        <span class="mui-icon mui-icon-gear"></span>
		        <span class="mui-tab-label">设置</span>
		    </a>
		</nav>-->
	    <div class="mui-content mui-scroll-wrapper">
	      <div class="mui-scroll">
	        <!-- 主界面具体展示内容 -->
	        
	
<form class="mui-input-group">
    <div class="mui-input-row">
        <label >材料计算</label>
        <input id="mess" name="test_rt" style="position:absolute;left:90px; right: 100px; "type="number" placeholder="请输入平方总数">
        <button id='alertBtn' style="top:1px;"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined">计算</button>
        
    </div>
    
     <div class="mui-input-row">
        <label >圆管密度</label>
        <select style="position:absolute;left:100px; width: 40px;" id="yuanguanmiduid" NAME="TEMP" onchange=quyuangmidu()>
<option value="1">密</option>
<option value="2">标</option>
<option value="3">稀</option>
<option value="4">小</option>
<option value="5">中</option>
<option value="6">大</option>
<option value="7">特</option>
<option value="8">极</option>
<option value="9">超</option>
<option value="10">顶</option>
</select>
<label >圆管大小</label>
<select style="position:absolute;right:50px; width: 80px;" id="quyuangdaxiaoid" NAME="TEMP" onchange=quyuangdaxiao()>
<option value="1.75">1.75</option>
<option value="1.8">1.8</option>
<option value="1.9">1.9</option>
<option value="2.2">2.2</option>
<option value="2.5">2.5</option>
<option value="3.2">3.2</option>
<option value="3.8">3.8</option>
</select>

    </div>
    
    
    
    <div class="mui-input-row">
        <label >防盗网平</label>
        <input id="messr" name="test_rt" style="position:absolute;left:110px; right: 100px; width: 100px"type="number" placeholder="宽度">
                <input id="messx" name="test_rt" style="position:absolute; left:220px;width:100px;right: 1000px; "type="number"  placeholder="高度">
        <button id='alertBtnpingmian' style="top:1px;"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined" onclick="fangdaowangpingmian();">计算</button>
        
    </div>
    <div class="mui-input-row">
        <label >防盗网伸</label>
        <input id="messd" name="test_rt" style="position:absolute;left:110px; right: 100px; width: 100px"type="number"  placeholder="伸">
         <!--<input id="messl" name="test_rt" style="position:absolute; left:220px;width:100px;right: 1000px; "type="number" class="mui-input-clear" placeholder="斜">-->
        <button id='alertBtnpingmian' style="top:1px;"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined" onclick="fangdaowanshengwang();">计算</button>
        
    </div>
    <div class="mui-input-row">
        
         <label >宽</label>
        <select style="position:absolute;left:100px; width: 40px;" id="yuanguanmiduida" NAME="TEMP" onchange=quyuangmidua()>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
</select>
<label >高</label>
<select style="position:absolute;right:50px; width: 80px;" id="quyuangdaxiaoidb" NAME="TEMP" onchange=quyuangdaxiaob()>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
</select>
            </div>
    
    	<div class="mui-input-row">
        <label >圆管中对中</label>
        <input id="messzfdz" name="test_rtzdz" style="position:absolute;left:120px; right: 100px; "type="number" placeholder="长度">
        <button id='azdzrdstBtn' style="top:1px;"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined"onclick="yuanguanzdzjisuan();">计算</button>
        
    </div>
    <div class="mui-input-row">
        <label >结果</label>
        <input id="mecgss" name="test_ht" style="position:absolute;left:90px; right: 100px; "type="number" placeholder="0">
        
    </div>
     <div class="mui-input-row">
         
        <button id='azdzrtBtng' style="position:absolute;top:1px;left:5px;width:160px;"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined" onclick="chushihua();">初始化</button>
        <button id='azdzrtBtnh' style="position:absolute;top:1px;right:5px;width:180px"  type="button" class="mui-btn mui-btn-primary mui-btn-outlined" onclick="jisuanzdzjg();">计算</button>
        
    </div>
</form>

	   





	
	      </div>
	    </div>  
	    <div class="mui-off-canvas-backdrop"></div>
	  </div>
	</div>
	
<script type ="text/javascript">

document.getElementById("mecgss").readOnly = true ;

var ygzdzjsrdd =0;


function fangdaowangpingmian(){ //计算平面防盗网
		var kdq=document.getElementById("messr").value //宽
	    var gdq=document.getElementById("messx").value //高
			if(kdq>0||gdq>0){
				var obj = document.getElementById("yuanguanmiduida");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var valuw = obj.options[index].value;// 选中值  中间方管根数
            var zjkduqie= kdq - 5; //中间方管宽度
			var yuangggd = gdq - 1.5; //圆管高度
			var fanggnk = valuw*2.5+5 ; // 根数尺寸
			var fanggnkjg = gdq-fanggnk; // 高减掉 根数的尺寸
			var fanggnkjs = accAdd(valuw,1); // 根数加1
			var fangghhh = fanggnkjg / fanggnkjs; 
			var obj = document.getElementById("quyuangdaxiaoid");//定位id
            var index = obj.selectedIndex; // 选中索引
            var text = obj.options[index].text; // 选中文本
            var valup = obj.options[index].value;// 选中值
			var yuanguangenshu = accAdd(zjkduqie , valup);  //方管中间尺寸加圆管大小
            var first = yuanguangenshu.substring(0,2);// 取 圆管前面2位
		    var obj = document.getElementById("yuanguanmiduid");//定位id
            var index = obj.selectedIndex; // 选中索引
            var text = obj.options[index].text; // 选中文本
            var valun = obj.options[index].value;// 选中值
		    var firx = Subtr(first,valun);  // 切的圆管根数
		    var yuanguangenshu = accDiv(yuanguangenshu,firx); //圆管间距
		    
		    
	var aStr = "宽度:"+kdq+"切2根\n"+"中间:"+zjkduqie+"切"+valuw+"根\n"+"高度:"+gdq+"切2根\n"+"方管内空:"+fangghhh+"CM\n"+"圆管根数:"+firx+"根\n" +"圆管间距:"+yuanguangenshu+"CM\n" ;
     mui.alert(aStr, '防盗网平面下料计算', function() {
                   // info.innerText = '你刚关闭了警告框';
                });
				
			}else{
				mui.toast("请输入宽和高");
			}
	
	//mui.toast(aStr);
}
function fangdaowanshengwang(){
	var kdq=document.getElementById("messr").value //宽
	    var gdq=document.getElementById("messx").value //高
	    var kdqt=document.getElementById("messd").value ;//伸管
			if(kdq>0||gdq>0||kdqt>0){
				var obj = document.getElementById("yuanguanmiduida");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var valuw = obj.options[index].value;// 选中值  中间方管根数
            var zjkduqie= kdq - 5; //中间方管宽度
			var yuangggd = gdq - 1.5; //圆管高度
			var fanggnk = valuw*2.5+5 ; // 根数尺寸
			var fanggnkjg = gdq-fanggnk; // 高减掉 根数的尺寸
			var fanggnkjs = accAdd(valuw,1); // 根数加1
			var fangghhh = fanggnkjg / fanggnkjs; 
			var obj = document.getElementById("quyuangdaxiaoid");//定位id
            var index = obj.selectedIndex; // 选中索引
            var text = obj.options[index].text; // 选中文本
            var valup = obj.options[index].value;// 选中值
			var yuanguangenshu = accAdd(zjkduqie , valup);  //方管中间尺寸加圆管大小
            var first = yuanguangenshu.substring(0,2);// 取 圆管前面2位
		    var obj = document.getElementById("yuanguanmiduid");//定位id
            var index = obj.selectedIndex; // 选中索引
            var text = obj.options[index].text; // 选中文本
            var valun = obj.options[index].value;// 选中值
		    var firx = Subtr(first,valun);  // 切的圆管根数
		    var yuanguangenshu = accDiv(yuanguangenshu,firx); //圆管间距
		     var obj = document.getElementById("yuanguanmiduida");//定位id
           var index = obj.selectedIndex; // 选中索引
           var text = obj.options[index].text; // 选中文本
          var valussa = obj.options[index].value;// 选中值
		    
		    var tdfhc =Subtr(kdqt,5);
		    var shengdgenshu = accMul(valuw,2) + accMul(valussa ,2) + 4 ;//伸管数量
		   var obj = document.getElementById("yuanguanmiduida");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var valwe = obj.options[index].value;// 选中值
		   var shangxiafanggjx = accAdd(valwe , 2) ;//方管+2
		   var shangxiafangg = accMul(shangxiafanggjx ,2.5) ; //上下方管尺寸
		   var fanggssxx =accAdd(valwe , 1) ; //要除的根数
		   var  faggsdfg= Subtr(kdq,shangxiafangg); //宽度- 方管根数尺寸
		   var shangxiafa= accDiv(faggsdfg,fanggssxx);
		    
		   // mui.toast(shangxiafa);
		    
	var aStr = "宽度:"+kdq+"切2根\n"+"中间:"+zjkduqie+"切"+valuw+"根\n"+"高度:"+gdq+"切2根\n"+"方管内空:"+fangghhh+"CM\n"+"圆管根数:"+firx+"根\n" +"圆管间距:"+yuanguangenshu+"CM\n" +"方管伸:"+tdfhc+"CM切"+shengdgenshu+"根\n"+"上下方管间距"+shangxiafa +"CM";
		    
	
    mui.alert(aStr, '防盗网平面下料计算', function() {
                   // info.innerText = '你刚关闭了警告框';
              });
				
			}else{
				mui.toast("请输入宽和高");
			}
	
	
	
	
	
}

//防盗网中对中计算
function yuanguanzdzjisuan(){
	

  
  var kdzdz=document.getElementById("messzfdz").value
     var obj = document.getElementById("quyuangdaxiaoid");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var valua = obj.options[index].value;// 选中值
		var jsggy=accAdd(kdzdz,valua);
		var first = jsggy.substring(0,2);
		var firx = Subtr(first,1);  // 切的圆管根数
		
		var obj = document.getElementById("yuanguanmiduid");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var value = obj.options[index].value;// 选中值
			
     
			var yuangz=Subtr(first,value);  //拿到密度数据
			
			var ygjg =accDiv(jsggy,yuangz); //得到第一根线
			
			var kdzj = accDiv(valua,2); 
			
	        var ygnkjd = Subtr(ygjg,kdzj);
		
		    ygzdzjsrdd = ygjg;
		    
		    if( kdzdz>0){
		    	
		    	document.getElementById('mecgss').value = ygnkjd
		    	
		    	}else{
		    		
		    		mui.toast("请输入材料长度");	
		    		
		    	
		    	
		    	
		    }
		
		
	
}
function jisuanzdzjg(){ //计算圆管中对中结果连加
	
	var kdzdz=document.getElementById("mecgss").value
	
	 if( kdzdz>0){
	 	var jsggy=accAdd(kdzdz,ygzdzjsrdd);
		document.getElementById('mecgss').value = jsggy
	 }else{
	 	document.getElementById('mecgss').value = 0
	 }
	
	//mui.toast(ygzdzjsrdd);
}


function chushihua(){
	// 完成初始化
	document.getElementById('mess').value = ""
	document.getElementById('messr').value = ""
	document.getElementById('messx').value = ""
	document.getElementById('messx').value = ""
	document.getElementById('messd').value = ""
	//document.getElementById('messl').value = ""//斜 已经去掉
	document.getElementById('messzfdz').value = ""
	document.getElementById('mecgss').value = ""
	
	 var options = document.getElementById('yuanguanmiduid').children;
        options[1].selected=true; //用数组控制下拉列表框的当前选中项
	var options = document.getElementById('quyuangdaxiaoid').children;
        options[1].selected=true; //用数组控制下拉列表框的当前选中项
        var options = document.getElementById('yuanguanmiduida').children;
        options[0].selected=true; //用数组控制下拉列表框的当前选中项
        var options = document.getElementById('quyuangdaxiaoidb').children;
        options[0].selected=true; //用数组控制下拉列表框的当前选中项
}
// 防盗窗材料数量计算
var info = document.getElementById("info");
document.getElementById("alertBtn").addEventListener('tap', function() {
    var t=document.getElementById("mess").value
    	
		fgps=accMul(t,0.8);
		ygpm=accMul(t,1.38);
		ygsm=accMul(t,1.2);
		var aStr = "方管:"+fgps+"根\n"+"圆管平面:"+ygpm+"根\n" + "圆管伸面:"+ygsm+"根\n"
    
    if( t>0)
        {
                 	  
         mui.alert(aStr, '材料数量', function() {
        //info.innerText = '你刚关闭了警告框';
    });
     
     }else{
		    		
		    		mui.toast("请输入材料总平方");	
     
     
        }

});




function quyuangmidu(){ //获取 选择框的值
	var obj = document.getElementById("yuanguanmiduid");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var value = obj.options[index].value;// 选中值
			mui.toast(value);
}
function quyuangdaxiao(){ //获取 选择框的值
	var obj = document.getElementById("quyuangdaxiaoid");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var value = obj.options[index].value;// 选中值
			mui.toast(value);
}
function quyuangmidua(){ //获取 选择框的值
	var obj = document.getElementById("yuanguanmiduida");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var value = obj.options[index].value;// 选中值
			mui.toast(value);
}
function quyuangdaxiaob(){ //获取 选择框的值
	var obj = document.getElementById("quyuangdaxiaoidb");//定位id
      var index = obj.selectedIndex; // 选中索引
    var text = obj.options[index].text; // 选中文本
    var value = obj.options[index].value;// 选中值
			mui.toast(value);
}
//js 加法计算  
//调用：accAdd(arg1,arg2)  
//返回值：arg1加arg2的精确结果   
function accAdd(arg1,arg2){   
  var r1,r2,m;   
  try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}   
  try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}   
  m=Math.pow(10,Math.max(r1,r2))   
  return ((arg1*m+arg2*m)/m).toFixed(2);   
}   
//js 减法计算  
//调用：Subtr(arg1,arg2)  
//返回值：arg1减arg2的精确结果   
function Subtr(arg1,arg2){  
     var r1,r2,m,n;  
     try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}  
     try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}  
     m=Math.pow(10,Math.max(r1,r2));  
     //last modify by deeka  
     //动态控制精度长度  
     n=(r1>=r2)?r1:r2;  
     return ((arg1*m-arg2*m)/m).toFixed(2);  
}   
//js 除法函数  
//调用：accDiv(arg1,arg2)  
//返回值：arg1除以arg2的精确结果   
function accDiv(arg1,arg2){   
  var t1=0,t2=0,r1,r2;   
  try{t1=arg1.toString().split(".")[1].length}catch(e){}   
  try{t2=arg2.toString().split(".")[1].length}catch(e){}   
  with(Math){   
    r1=Number(arg1.toString().replace(".",""))   
    r2=Number(arg2.toString().replace(".",""))   
    return (r1/r2)*pow(10,t2-t1);   
  }   
}   
  
//js 乘法函数  
//调用：accMul(arg1,arg2)   
//返回值：arg1乘以arg2的精确结果   
function accMul(arg1,arg2)   
{   
  var m=0,s1=arg1.toString(),s2=arg2.toString();   
  try{m+=s1.split(".")[1].length}catch(e){}   
  try{m+=s2.split(".")[1].length}catch(e){}   
  return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)   
}   


//1.1 <input type="text" name="test" id="test">
//
//通过var t=document.getElementById("test").value把值赋给变量t,
//
//1.2 当然也可以反过来把已知的变量值赋给文本框，例如：
//
//var m = "5";
//document.getElementById("test").value= m;

  </script>
	
	
</body>
</html>